<template>
</template>

<script setup>
import { h, defineProps, defineExpose } from "vue";
import { ElMessage } from "element-plus";


import errorIcon from "@/assets/images/error-icon.svg";
import successIcon from "@/assets/images/success-icon.svg";
import warningIcon from "@/assets/images/warning-icon.svg";

/**
 * @param string type warning: 警告.success：成功.error：错误
 * @param string message 展示提示消息
 * */
const props = defineProps({
  message: {
    type: String,
    default: ""
  },
  type: {
    type: String,
    default: ""
  },
})
const openVn = () => {
  let icon = null
  if(props.type === 'warning') {
    icon = warningIcon
  } else if( props.type === 'success') {
    icon = successIcon
  }
  else if( props.type === 'error') {
    icon = errorIcon
  }
  ElMessage({
    message: h('p', null, [
      h('span', null, props.message),
    ]),
    icon: h('div',null, [
      h('img',  { src: icon },),
    ]),
    grouping: true,
  })
}
defineExpose({
  openVn
})
</script>

<style lang="scss" scoped>
</style>
